<template>
  <div class="example">
    <header :class="$style.header">头部</header>
    <main :class="$style.main">内容</main>
    <footer :class="$style.footer">底部</footer>
  </div>
</template>

<style module lang="scss">
.header,
.main,
.footer {
  height: 100px;
  width: 500px;
  border: 1px solid #000;
  font-size: 18px;
  font-weight: bold;
}
.header {
  margin-bottom: 20px;
  color: palevioletred;
}
.main {
  margin-bottom: 20px;
  color: green;
}
.footer {
  color: blue;
}
</style>
